/*
 * @Description:
 * @Version: 2.0
 * @Autor: Seven
 * @Date: 2023-10-19 16:08:00
 * @LastEditors: Seven
 * @LastEditTime: 2023-10-24 16:20:01
 */
import { getEquipmentAdd, getEquipmentEdit } from "@/services/modules/plan";
import { Form, Input, Modal, Select } from "antd";
import { loacalCache } from "@/ultils/func";

import React, { memo, useEffect, useRef } from "react";
const { Option } = Select;
const formItemLayout = {
  labelCol: {
    xs: { span: 24 },
    sm: { span: 6 },
  },
  wrapperCol: {
    xs: { span: 24 },
    sm: { span: 18 },
  },
};
const AddModal = memo(
  ({ modalVisible, handleCancel, getList, title = "新增", rowInfoData }) => {
    const formRef = useRef();
    const [form] = Form.useForm();
    function onFinish() {
      form
        .validateFields({ validateOnly: true })
        .then((res) => {
          console.log(res, "res++++++");
          let data = form.getFieldsValue();
          if (title === "编辑") {
            getEquipmentEdit(rowInfoData.id, data).then((res) => {
              if (res.code === 200) {
                getList();
                handleCancel();
              }
            });
          } else {
            getEquipmentAdd(data).then((res) => {
              if (res.code === 200) {
                getList();
                handleCancel();
              }
            });
          }
        })
        .catch((err) => {
          console.log(err);
        });
    }

    useEffect(() => {
      if (title === "编辑") {
        form.setFieldsValue({
          ...rowInfoData,
        });
      }
    }, [rowInfoData, form, title]);

    return (
      <div>
        <Modal
          title={title}
          open={modalVisible}
          onOk={onFinish}
          onCancel={handleCancel}
        >
          <Form
            {...formItemLayout}
            ref={formRef}
            onFinish={onFinish}
            form={form}
            style={{
              maxWidth: 600,
            }}
          >
            <Form.Item
              name="registrationId"
              label="设备编号"
              rules={[
                {
                  required: true,
                  message: "请输入你的设备编号",
                },
              ]}
            >
              <Input />
            </Form.Item>
            <Form.Item
              name="registrationName"
              label="设备名称"
              rules={[
                {
                  required: true,
                  message: "请输入你的设备名称",
                },
              ]}
            >
              <Input />
            </Form.Item>
            <Form.Item
              name="dept"
              label="部门"
              rules={[
                {
                  required: true,
                  message: "请输入你的部门",
                },
              ]}
            >
              <Input />
            </Form.Item>
            <Form.Item
              name="registrationType"
              label="设备类型"
              rules={[
                {
                  required: true,
                  message: "请选择你的设备类型",
                },
              ]}
            >
              <Input />
            </Form.Item>
            <Form.Item
              name="line"
              label="线路"
              rules={[
                {
                  required: true,
                  message: "请选择你的线路",
                },
              ]}
            >
              <Select>
                {loacalCache.getCache("DicDataList")?.["line"] &&
                  loacalCache.getCache("DicDataList")?.["line"].map((item) => {
                    return (
                      <Option value={item.value} key={item.id}>
                        {item.label}
                      </Option>
                    );
                  })}
              </Select>
            </Form.Item>
            <Form.Item
              name="speciality"
              label="专业"
              rules={[
                {
                  required: true,
                  message: "请输入你的专业",
                },
              ]}
            >
              <Select>
                {loacalCache.getCache("DicDataList")?.["falut_speciality"] &&
                  loacalCache
                    .getCache("DicDataList")
                    ?.["falut_speciality"].map((item) => {
                      return (
                        <Option value={item.value} key={item.id}>
                          {item.label}
                        </Option>
                      );
                    })}
              </Select>
            </Form.Item>
            {title !== "编辑" && (
              <Form.Item
                name="location"
                label="位置"
                rules={[
                  {
                    required: true,
                    message: "请输入你的位置",
                  },
                ]}
              >
                <Input />
              </Form.Item>
            )}
            <Form.Item
              name="supplier"
              label="供应商"
              rules={[
                {
                  required: true,
                  message: "请选择你的供应商",
                },
              ]}
            >
              <Input />
            </Form.Item>
          </Form>
        </Modal>
      </div>
    );
  }
);

export default AddModal;
